@import 'wildcard/src/global-styles/breakpoints';

.batch-change-node {
    &__badge {
        width: 100%;
        @media (--xs-breakpoint-down) {
            width: fit-content;
            // Make it full width in the current row.
            grid-column: 1 / -1;
        }
    }
    &__title {
        @media (--sm-breakpoint-down) {
            // Emulate h4 on sm and xs devices.
            font-size: 0.875rem;
            line-height: (20/14);
            font-weight: 600;
        }
    }
    &__content {
        @media (--xs-breakpoint-down) {
            width: fit-content;
            // Make it full width in the current row.
            grid-column: 1 / -1;
        }
        min-width: 0;
    }
    &__separator {
        // Make it full width in the current row.
        grid-column: 1 / -1;
        border-top: 1px solid var(--border-color-2);
        @media (--xs-breakpoint-down) {
            margin-top: 1rem;
            padding-bottom: 1rem;
        }
    }
}
